"use client"

import { useEffect, useState } from "react"
import { Alert, AlertDescription } from "@/components/ui/alert"
import { WifiOff } from "lucide-react"
import { isOfflineMode, getOfflineModePreference } from "@/lib/db"

export default function SampleDataNotice() {
  const [showNotice, setShowNotice] = useState(false)

  useEffect(() => {
    // 检查是否处于离线模式
    const offline = isOfflineMode() || getOfflineModePreference()
    setShowNotice(offline)
  }, [])

  if (!showNotice) return null

  return (
    <Alert className="mb-4 bg-yellow-50 border-yellow-200">
      <WifiOff className="h-4 w-4 text-yellow-600" />
      <AlertDescription className="text-yellow-800">
        您当前处于离线模式。在此模式下，您只能查看已缓存的数据，无法创建新投票或参与投票。
      </AlertDescription>
    </Alert>
  )
}
